<template>
	<view class="signOrder-wrap">
		<view class="signOrder-tab"><u-tabs v-model="activeTab" :scroll="false" :tabs="['全部', '服务中', '已失效']" @change="tabChange"></u-tabs></view>
		<scroll-view class="signOrder-list" scroll-y="true" @scrolltolower="scrollLoading()">
			<view v-for="(order, index) in dataList" :key="index" class="sign-item-wrap">
				<view class="sign-item-card" @click="gotoRouter('/pages-hospital/signOrderDetail/signOrderDetail?id=' + order.id)">
					<view class="sign-title-wrap">
						<image :src="order.picture"></image>
						<view class="doctor-name">{{order.userName}}</view>
						<view class="doctor-department">{{order.phone}}</view>
						<view :class="statusStyle[order.status]">{{statusName[order.status]}}</view>
					</view>
					<view class="divider-line"></view>
					<view class="sign-info" style="margin-top: 0;">服务时长：{{order.signingName}}</view>
					<view class="sign-info">开始日期：{{order.serviceStartDate}}</view>
					<view class="sign-info">结束日期：{{order.serviceEndDate}}</view>
				</view>
			</view>
			<u-empty-state v-if="dataTotalPage == 0" value="暂无签约订单"></u-empty-state>
			<view v-if="dataList.length > 0 && totalSize == dataList.length" class="end-line">～我是有底线的呢～</view>
			<view style="height: 40rpx;"></view>
		</scroll-view>
	</view>
</template>

<script>
	import uTab from '@/components/u-tabs/u-tabs.vue';
	import uniLoadMore from '@/components/uni/uni-load-more/uni-load-more.vue';
	import uEmptyState from '@/components/u-empty-state/u-empty-state.vue';
	export default {
		components: {
			uTab,
			uniLoadMore,
			uEmptyState
		},
		data() {
			return {
				//1.服务中 2.已失效
				statusStyle: {
					1: 'server-status-valid',
					2: 'server-status-invalid'
				},
				statusName: {
					1: '服务中',
					2: '已失效'
				},
				activeTab: 0,
				pageNo: 1,
				pageSize: 20,
				dataTotalPage: 1, //数据总数
				dataLoading: 'loading', //数据加载
				totalSize: 0,
				dataList: []
			};
		},
		onLoad(option) {
			this.getSignList();
		},
		onShow() {},
		methods: {
			tabChange(e) {
				this.activeTab = e;
				this.pageNo = 1;
				this.dataList = [];
				this.dataTotalPage = 1;
				this.scrollLoading();
			},
		
			getSignList() {
				let params = {
					pageNo: this.pageNo,
					pageSize: this.pageSize
				};
				switch (this.activeTab) {
					case 0:
						break;
					case 1:
						params.status = 1;
						break;
					case 2:
						params.status = 2;
						break;
				}
		
				this.$api
					.queryDoctorSignOrders({
						params: params
					})
					.then(res => {
						if (res.code == 200) {
							this.dataTotalPage = res.result.pages;
							this.totalSize = res.result.total;
							if (this.pageNo == 1) {
								this.dataList = res.result.records;
							} else {
								this.dataList = this.dataList.concat(res.result.records);
							}
		
							if (res.result.current >= res.result.pages) {
								this.dataLoading = 'noMore';
							} else {
								this.dataLoading = 'loading';
							}
							this.pageNo++;
						} else {
							uni.showToast({
								title: res.message,
								icon: 'none'
							});
						}
					});
			},
		
			//滚动加载
			scrollLoading() {
				if (this.pageNo <= this.dataTotalPage) {
					this.getSignList();
				}
			}
		}
	}
</script>

<style lang="less" scoped>
@import './doctorSignList.less';
</style>
